<template>
<div class="container">
    <wxc-minibar :title="pagename">
    </wxc-minibar>
    <div class="sub_form">
        <div class="project_money">
            <text class="project_money_name">方案金额</text>
            <text class="project_money_num" v-if="currentPro">{{currentPro.money}}元</text>
        </div>
        <!-- 请求表单 -->
        <div class="sub_form_body">
            <div class="sub_form_body_item">
                <div class="sub_form_body_left">
                    <text class="sub_form_body_left_star">*</text>
                    <text class="sub_form_body_left_name">我要认购</text>
                </div>
                <div class="sub_form_body_right">
                    <div class="sub_form_body_right_input_c">
                        <input style="font-size:28px;" @focus="focusone(1)" :disabled="pageType === 'change'" :style="ifdisable" v-model="currentReq.buySelf" class="sub_form_body_right_input" type="number" :placeholder="placeholder[0]">
                    </div>
                    <text style="margin-left:20px;font-size: 32px;">元</text>
                </div>
            </div>
            <div class="sub_form_body_item">
                <div class="sub_form_body_left">
                    <text class="sub_form_body_left_star">*</text>
                    <text class="sub_form_body_left_name">最少跟单</text>
                </div>
                <div class="sub_form_body_right">
                    <div class="sub_form_body_right_input_c">
                        <input style="font-size:28px;" @focus="focusone(2)" :disabled="pageType === 'change'" :style="ifdisable" v-model="currentReq.minFollow" class="sub_form_body_right_input" type="number" :placeholder="placeholder[1]">
                    </div>
                    <text style="margin-left:20px;font-size: 32px;">元</text>
                </div>
            </div>
                    <div class="sub_form_body_item">
                        <div class="sub_form_body_left">
                            <text class="sub_form_body_left_star" style="color:#FFF;">*</text>
                            <text class="sub_form_body_left_name">我要保底</text>
                        </div>
                        <div class="sub_form_body_right">
                            <div class="sub_form_body_right_input_c">
                                <input style="font-size:28px;" @focus="focusone(3)" v-model="currentReq.keepForMe" class="sub_form_body_right_input" type="number" :placeholder="placeholder[2]">
            </div>
                                <text style="margin-left:20px;font-size: 32px;">元</text>
                            </div>
                        </div>
                        <div class="sub_form_body_item">
                            <div class="sub_form_body_left">
                                <text class="sub_form_body_left_star" style="color:#FFF;">*</text>
                                <text class="sub_form_body_left_name">盈利佣金</text>
                            </div>
                            <div class="sub_form_body_right">
                                <div class="sub_form_body_right_input_c">
                                    <input style="font-size:28px;" @focus="focusone(4)" :disabled="pageType === 'change'" :style="ifdisable" v-model="currentReq.pricePer" class="sub_form_body_right_input" type="number" :placeholder="placeholder[3]">
            </div>
                                    <text style="margin-left:20px;font-size: 32px;">%</text>
                                </div>
                            </div>
                            <div class="sub_form_body_item">
                                <div class="sub_form_body_left">
                                    <text class="sub_form_body_left_star" style="color:#FFF;">*</text>
                                    <text class="sub_form_body_left_name">保密设置</text>
                                </div>
                                <div class="sub_form_body_right_btns">
                                    <div class="sub_form_body_right_btn" :style="safetyClass(index,item)" v-for="(item,index) in safetySet" :key="index+1/2" @click="choseSafeObj(item)">
                                        <text class="sub_form_body_right_btn_text2" v-if="currentReq.safetySetVal === item.value">{{item.name}}</text>
                                        <text class="sub_form_body_right_btn_text1" v-if="currentReq.safetySetVal !== item.value">{{item.name}}</text>
                                    </div>
                                </div>
                            </div>
                            <div class="sub_form_body_item">
                                <div class="sub_form_body_left">
                                    <text class="sub_form_body_left_star" style="color:#FFF;">*</text>
                                    <text class="sub_form_body_left_name">方案标题</text>
                                </div>
                                <div class="sub_form_body_right">
                                    <div class="sub_form_body_right_input_c_b">
                                        <input style="font-size:28px;" @focus="focusone(5)" :disabled="pageType === 'change'" :style="ifdisable" v-model="currentReq.proTitle" class="sub_form_body_right_input_b" type="text" :placeholder="placeholder[4]">
            </div>
                                    </div>
                                </div>
                                <div class="sub_form_body_item">
                                    <div class="sub_form_body_left">
                                        <text class="sub_form_body_left_star" style="color:#FFF;">*</text>
                                        <text class="sub_form_body_left_name">方案描述</text>
                                    </div>
                                    <div class="sub_form_body_right">
                                        <div class="sub_form_body_right_input_c_b">
                                            <input style="font-size:28px;" @focus="focusone(6)" :disabled="pageType === 'change'" :style="ifdisable" v-model="currentReq.proDesc" class="sub_form_body_right_input_b" type="text" :placeholder="placeholder[5]">
            </div>
                                        </div>
                                    </div>
                                </div>
                                <!-- 请求表单 -->
                                <div class="submit">
                                    <wxc-button :text="submitBtnText" :disabled="btnDisabled" :btnStyle="btnStyle" @wxcButtonClicked="submit"></wxc-button>
                                </div>
                            </div>
                              <loading-big v-if="loadingshow"></loading-big>
                            <!-- <wxc-loadingsp :show="loadingshow" type="custom" :need-mask="true" loading-text="加载中..." m-url="http://img.alicdn.com/tfs/TB1Ep_9NVXXXXb8XVXXXXXXXXXX-74-74.gif" m-width="200" m-height="200" m-backgroundcolor="#212021" m-textcolor="#ffffff">
                            </wxc-loadingsp> -->
                        </div>
</template>

<script>
import {
    Utils,
    WxcButton
} from "weex-ui";
import WxcLoadingsp from "../../components/modules/loading";
import {
    serialize,
    getBaseUrl,
    jsonAnalysis
} from "@/utils/index.js";
const modal = weex.requireModule("modal");
const navigator = weex.requireModule("navigator");
import goucai from "../../js/components/module.js";
import WxcMinibar from "@/components/modules/wxc-minibar/index.js";
import { lotteryTypes } from "@/js/global/index_data"
import { postResponsesToken } from "@/api.js";
import {  types } from 'util';
import loadingBig from "@/components/modules/loading-big";


export default {
    components: {
        WxcMinibar,
        WxcButton,
        WxcLoadingsp,
        loadingBig
        
    },
    data() {
        return {
            placeholder: ['最少认购1元', '最少跟单1元', '最少保底1元', '最少佣金1%', '方案标题', '精选方案描述'],
            pagename: "发起合买",
            pageType: "start",
            loadingshow: false,
            currentPro: null,
            buyLimit: {
                minBuy: -1, //最少认购
                minSafeguard: -1, //最少保底比
                maxRemuneration: -1, //最大盈利佣金比
            },
            currentReq: {
                buySelf: 0, //认购
                minFollow: 0, //最少跟单
                keepForMe: 0, //保底
                pricePer: 0, //盈利佣金
                safetySetVal: 1, //保密设置
                proTitle: "", //方案标题
                proDesc: "" //方案描述
            },
            btnStyle: {
                backgroundColor: "#E70D0D",
                borderRadius: "4px",
                width: "686px",
                height: "96px"
            },
            safetySet: [{
                    name: "公开",
                    value: 1
                },
                {
                    name: "参与后公开",
                    value: 2
                },
                {
                    name: "截止后公开",
                    value: 3
                }
            ]
        };
    },
    created() {},
    methods: {
        focusone(num) {
            if (num == 1 && this.currentReq.buySelf == 0) {
                this.currentReq.buySelf = ''
            };
            if (num == 2 && this.currentReq.minFollow == 0) {
                this.currentReq.minFollow = ''
            };
            if (num == 3 && this.currentReq.keepForMe == 0) {
                this.currentReq.keepForMe = ''
            };
            if (num == 4 && this.currentReq.pricePer == 0) {
                this.currentReq.pricePer = ''
            };
        },
        submit() {

            if (this.buyLimit.minBuy < 0 || this.buyLimit.minSafeguard < 0 || this.maxRemuneration < 0) {
                modal.alert({
                    message: '未查询到合买条件信息'
                });
                return flase;
            }

            if (this.currentReq.pricePer.toString().indexOf(".") >= 0 || this.currentReq.minFollow.toString().indexOf(".") >= 0 || this.currentReq.buySelf.toString().indexOf(".") >= 0 || this.currentReq.keepForMe.toString().indexOf(".") >= 0) {
                return modal.alert({
                    message: "不能输入小数"
                });
            }

            if (this.currentReq.buySelf >= Number(this.currentPro.money)) {
                return modal.alert({
                    message: `认购金额需小于${this.currentPro.money}元`,
                    okTitle: "好的"
                });
            }
            if (this.currentReq.buySelf < Math.ceil(this.currentPro.money * this.buyLimit.minBuy / 100)) {
                return modal.alert({
                    message: `认购金额不能少于${Math.ceil(this.currentPro.money*this.buyLimit.minBuy/100)}元`,
                    okTitle: "好的"
                });
            }

            if (this.currentReq.minFollow < 1) {
                return modal.alert({
                    message: `最少跟单不能少于1元`,
                    okTitle: "好的"
                });
            }
            if (this.currentReq.minFollow > this.currentPro.money - this.currentReq.buySelf) {
                return modal.alert({
                    message: `最大跟单不能多于${this.currentPro.money-this.currentReq.buySelf}元`,
                    okTitle: "好的"
                });
            }

            // if (this.currentReq.keepForMe < 1) {
            //   return modal.alert({
            //     message: `保底金额不能少于1元`,
            //     okTitle: "好的"
            //   });
            // }
            if (this.currentReq.keepForMe && this.currentReq.keepForMe !== 0 && this.currentReq.keepForMe < this.currentPro.money * this.buyLimit.minSafeguard / 100) {
                return modal.alert({
                    message: `最小保底金额${Math.ceil(this.currentPro.money*this.buyLimit.minSafeguard/100)}元`,
                    okTitle: "好的"
                });
            }
            if (
                this.currentReq.keepForMe && this.currentReq.keepForMe !== 0 && this.currentReq.keepForMe >
                this.currentPro.money - this.currentReq.buySelf
            ) {
                return modal.alert({
                    message: `保底金额不能大于${this.currentPro.money -
                this.currentReq.buySelf}元`,
                    okTitle: "好的"
                });
			}
			
            if (
                (this.currentReq.pricePer && this.currentReq.pricePer !== 0 && +this.currentReq.pricePer < 1) ||
                (this.currentReq.pricePer && this.currentReq.pricePer !== 0 && +this.currentReq.pricePer > +this.buyLimit.maxRemuneration)
            ) {
                return modal.alert({
                    message: `盈利佣金需在1-${this.buyLimit.maxRemuneration}范围内`,
                    okTitle: "好的"
                });
            }
            if (this.pageType === "change") {
                this.changeOrder();
                return;
            }

            this.createOrder();
		},
		
        async changeOrder() {
            if (
                Number(this.currentReq.keepForMe) ===
                Number(this.currentPro.safeguardMoney)
            ) {
                return modal.alert({
                    message: "请修改保底金额"
                });
            }
            let totalmoney = this.currentReq.keepForMe - this.currentPro.safeguardMoney;


            if (totalmoney < 0) {
                this.changeOrderDe(0 - totalmoney);
            } else {
                this.changeOrderAdd();
            }
		},
		
        async changeOrderAdd() {
            
            console.log()
            let hash = {
                type: "changeChip",
                operation:"modifyGuaranteeUp",
                totalmoney: this.currentReq.keepForMe - this.currentPro.safeguardMoney,
                lottotype: this.currentReq.proTitle + "-修改订单",
                detail:this.currentReq.proTitle + "-增加保底",
                order: this.currentPro.orderNo,
                lotteryNo: this.currentPro.lotteryNo
            };
            let baseurl = getBaseUrl(weex.config.bundleUrl, true);

          


            let jUrl = baseurl + `views/pay/pay.js?` + serialize(hash);
            var params = {
                url: jUrl,
                animated: "true"
            };
            navigator.push(params);
		},
		
        async changeOrderDe(totalmoney) {
            let reqBody = {
                type: "balance",
                operation: "modifyGuaranteeDown",
                detail: this.currentReq.proTitle + "-退款",
                unfreezeMoney: totalmoney,
                orderNo:this.currentPro.orderNo
            };

           
           
            this.loadingshow = true;
            try {
                let req = await postResponsesToken('cash/maccount/operate', reqBody)
            
                this.loadingshow = false;
                if (req.msg === "success") {
                    modal.alert({
                        message: "修改成功"
                    });
                    navigator.pop();
                }
            } catch (e) {
                this.loadingshow = false;
                modal.toast({
                    message: e
                });
            }
		},
		
        async createOrder() {

            if (!this.currentReq.keepForMe) {
                this.currentReq.keepForMe = 0;
            }
            if (!this.currentReq.pricePer) {
                this.currentReq.pricePer = 0;
            }
            this.currentPro.buyTogether = 1;
            if (this.currentReq.proTitle === '') {
                this.currentPro.title = this.lottoname + this.currentPro.issueIssue + "期(合买)";
            } else {
                this.currentPro.title = this.currentReq.proTitle;
            }
            if (this.currentReq.proDesc === '') {
                this.currentPro.describe = this.lottoname + '精选方案';
            } else {
                this.currentPro.describe = this.currentReq.proDesc;
            }
            this.currentPro.isOpen = this.currentReq.safetySetVal;
            this.currentPro.minParticipant = this.currentReq.minFollow;
            this.currentPro.remuneration = this.currentReq.pricePer;
            this.currentPro.safeguardMoney = this.currentReq.keepForMe;
            this.currentPro.buyMoney = this.currentReq.buySelf; 

             
            let baseurl = getBaseUrl(weex.config.bundleUrl, true);
            let t_money = Number(this.currentReq.buySelf) + Number(this.currentReq.keepForMe);

            
            let hash = Object.assign(this.currentPro, {
                type:'sponsorChipped',
                totalmoney: t_money,
                lottotype: this.currentPro.title,
                lotteryNo: this.currentPro.lotteryNo,
                lottoId: lotteryTypes[this.currentPro.lotteryNo].id
            })


                let jUrl = baseurl + `views/pay/pay.js?` + serialize(hash);
                var params = {
                    url: jUrl,
                    animated: "true"
                }


                
                navigator.push(params);
                
            // } else {//提示用户有敏感信息
            
            //     modal.toast({ message: req.msg });
			// }
              
                
            // } catch (e) {
            //     this.loadingshow = false;
            //     modal.toast({
            //         message: e
            //     });
            // }
		},
		
        safetyClass(index, item) {
            if (item.value === this.currentReq.safetySetVal) {
                return {
                    backgroundColor: "#E70D0D"
                };
            }
            if (index === 0) {
                return {
                    borderRightColor: "rgb(178, 178, 178)",
                    borderRightStyle: "solid",
                    borderRightWidth: "1px"
                };
            } else if (index === 2) {
                return {
                    borderLeftColor: "rgb(178, 178, 178)",
                    borderLeftStyle: "solid",
                    borderLeftWidth: "1px"
                };
            }
		},
		
        choseSafeObj(item) {
            if (this.pageType === "change") {
                return;
            }
            this.currentReq.safetySetVal = item.value;
		},
		
        getUrlParam() {
            var url = decodeURI(weex.config.bundleUrl);
			let query1 = jsonAnalysis(url.split("?")[1]);
			
             this.currentPro = query1;
			
            if (query1.jumpType) {
                this.pageType = query1.jumpType;
                this.pagename = "修改保底";
               
                this.currentReq.buySelf = Math.floor(Number(query1.buyMoney) * Number(query1.issueSum)); //认购 金额计算可能失误
                this.currentReq.minFollow = Number(query1.minParticipant);
                this.currentReq.keepForMe = Number(query1.safeguardMoney); //保底
                this.currentReq.pricePer = Number(query1.remuneration);
                this.currentReq.safetySetVal = Number(query1.isOpen);
                this.currentReq.proTitle = query1.title;
				this.currentReq.proDesc = query1.describetion;
				this.buyLimit.minSafeguard = query1.minSafeguard
            }
			
			this.lottoname = lotteryTypes[query1.lotteryNo].name
			
            let lotteryLimit = JSON.parse(query1.lotteryLimit)


			this.buyLimit.minBuy = lotteryLimit.minBuy;
			this.buyLimit.minSafeguard = lotteryLimit.minSafeguard;
			this.buyLimit.maxRemuneration = lotteryLimit.maxRemuneration;

			this.placeholder[0] = `最少认购${Math.ceil(this.currentPro.money*lotteryLimit.minBuy/100)}元`;
			this.placeholder[2] = `最少保底${Math.ceil(this.currentPro.money*lotteryLimit.minSafeguard/100)}元`;
			this.placeholder[3] = `1-${lotteryLimit.maxRemuneration}`;
			
			this.placeholder[4] = this.lottoname + ( this.currentPro.issue | this.currentPro.issueIssue) + "期(合买)";
			this.placeholder[5] = this.lottoname + '精选方案';

            
		},
		
       
    },
    mounted() {
        this.getUrlParam();
    },
    computed: {
        ifdisable() {
            if (this.pageType === "change") {
                return {
                    backgroundColor: "#ebebeb"
                };
            }
        },
        btnDisabled() {
            if (this.pageType === "start") {
                if (this.currentReq.buySelf && this.currentReq.minFollow) {
                    return false;
                }
                return true;
            } else {
                if (
                    this.currentReq.keepForMe !== Number(this.currentPro.safeguardMoney)
                ) {
                    return false;
                }
                return true;
            }
        },
        submitBtnText() {
            if (this.pageType === "start") {
                if (this.currentReq.buySelf) {
                    let money =
                        Number(this.currentReq.buySelf) + Number(this.currentReq.keepForMe);
                    return `发布订单(支付${money}元)`;
                }
                return `发布订单`;
            } else {
                if (this.currentReq.buySelf) {
                    let money = this.currentReq.keepForMe - Number(this.currentPro.safeguardMoney);

                    if (money < 0) {
                        return `修改订单(退款${(0 - money).toFixed(2)}元)`;
                    }
                    return `修改订单(支付${money.toFixed(2)}元)`;
                }
                return `修改订单`;
            }
        },
        submitText() {
            return `发布订单(支付${this.currentReq.buySelf}元)`;
        }
    }
};
</script>

<style scoped>
.sub_form_body_left_name {
    font-size: 32px;
}

.submit {
    justify-content: center;
    align-items: center;
    margin-top: 150px;
}

.sub_form_body_right_btn_text2 {
    font-size: 28px;
    color: #fff;
}

.sub_form_body_right_btn_text1 {
    font-size: 28px;
    color: #b2b2b2;
}

.sub_form_body_right_btn {
    width: 160px;
    height: 64px;
    align-items: center;
    justify-content: center;
}

.sub_form_body_right_btns {
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    align-self: center;
    margin-left: 33px;
    flex-direction: row;
    border-top-color: rgb(178, 178, 178);
    border-top-style: solid;
    border-top-width: 1px;
    border-right-color: rgb(178, 178, 178);
    border-right-style: solid;
    border-right-width: 1px;
    border-bottom-color: rgb(178, 178, 178);
    border-bottom-style: solid;
    border-bottom-width: 1px;
    border-left-color: rgb(178, 178, 178);
    border-left-style: solid;
    border-left-width: 1px;
}

.sub_form_body_right_input_b {
    width: 450px;
    padding-top: 10px;
    padding-right: 10px;
    padding-bottom: 10px;
    padding-left: 10px;
}

.sub_form_body_right_input_c_b {
    width: 440px;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: rgb(238, 238, 238);
}

.sub_form_body_right_input_c {
    width: 280px;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: rgb(238, 238, 238);
}

.sub_form_body_right_input {
    width: 280px;
    padding-top: 10px;
    padding-right: 10px;
    padding-bottom: 10px;
    padding-left: 10px;
}

.sub_form_body_right {
    align-self: center;
    margin-left: 33px;
    padding-right: 10px;
    padding-left: 10px;
    flex-direction: row;
    align-items: center;
}

.sub_form_body_left_star {
    color: #e70d0d;
}

.sub_form_body_left {
    flex-direction: row;
    align-items: center;
}

.sub_form_body_item {
    flex-direction: row;
    height: 70px;
    margin-bottom: 25px;
}

.sub_form_body {
    padding-top: 48px;
    padding-right: 32px;
    padding-bottom: 0px;
    padding-left: 32px;
}

.project_money_num {
    font-size: 32px;
    color: #e70d0d;
    margin-left: 80px;
}

.project_money_name {
    font-size: 32px;
    color: #333333;
}

.project_money {
    flex-direction: row;
    margin-top: 32px;
    margin-right: 32px;
    margin-bottom: 0px;
    margin-left: 32px;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: rgb(206, 201, 201);
    padding-bottom: 24px;
}

.sub_form {
    width: 750px;
}

.header-con {
    display: flex;
    justify-content: center;
    position: relative;
    align-items: center;
    flex-direction: row;
}

.header-title {
    font-size: 34px;
    color: red;
    font-weight: 600;
    font-family: PingFangSC-Medium;
}
</style>
